<?xml version="1.0" encoding="UTF-8"?>

<div xmlns="http://www.w3.org/1999/xhtml" component="$model/UI2/system/components/justep/window/window" data-bind="component:{name:'$model/UI2/system/components/justep/window/window'}" __justepbasexid__="__baseID__" components="$model/UI2/system/components/justep/panel/panel,$model/UI2/system/components/justep/panel/child,$model/UI2/system/components/justep/windowDialog/windowDialog,$model/UI2/system/components/justep/button/buttonGroup,$model/UI2/system/components/justep/window/window,$model/UI2/system/components/justep/titleBar/titleBar,$model/UI2/system/components/justep/button/button,">  
  <div xmlns="" component="$model/UI2/system/components/justep/panel/panel" class="x-panel x-full" xid="panel1" data-bind="component:{name:'$model/UI2/system/components/justep/panel/panel'}"> 
    <div class="x-panel-top" xid="top1" component="$model/UI2/system/components/justep/panel/child" data-bind="component:{name:'$model/UI2/system/components/justep/panel/child'}"> 
      <div component="$model/UI2/system/components/justep/titleBar/titleBar" class="x-titlebar" xid="titleBar1" data-bind="component:{name:'$model/UI2/system/components/justep/titleBar/titleBar'}" data-config="{&quot;title&quot;:&quot;button&quot;}"> 
        <div class="x-titlebar-left" xid="div1" id="te"> 
          <a component="$model/UI2/system/components/justep/button/button" class="btn btn-link btn-icon-left" xid="button20" data-bind="component:{name:'$model/UI2/system/components/justep/button/button'}" data-events="onClick:returnMainPage" data-config="{&quot;icon&quot;:&quot;icon-chevron-left&quot;}"> 
            <i xid="i11" class="icon-chevron-left"/>  
            <span xid="span11"/> 
          </a> 
        </div>  
        <div class="x-titlebar-title" xid="div2">button</div>  
        <div class="x-titlebar-right " xid="div3"> 
          <div class="empty"/> 
        </div> 
      </div> 
    </div>  
    <div class="x-panel-content" xid="content2" component="$model/UI2/system/components/justep/panel/child" data-bind="component:{name:'$model/UI2/system/components/justep/panel/child'}"> 
      <h3 style="height:48px;vertical-align: middle;padding: 8px;display: inline-block;">button icon</h3>  
      <a component="$model/UI2/system/components/justep/button/button" class="btn btn-link" xid="button6" data-bind="component:{name:'$model/UI2/system/components/justep/button/button'},visible:isVisible" data-events="onClick:showiconSource" data-config="{&quot;label&quot;:&quot;源码&quot;}"> 
        <i xid="i6"/>  
        <span xid="span8">源码</span> 
      </a>  
      <div xid="buttonicon"> 
        <a component="$model/UI2/system/components/justep/button/button" class="btn btn-default" xid="button11" data-bind="component:{name:'$model/UI2/system/components/justep/button/button'}" data-config="{&quot;icon&quot;:&quot;icon-loading-a&quot;}"> 
          <i xid="i12" class="icon-loading-a"/>  
          <span xid="span12"/> 
        </a>  
        <a component="$model/UI2/system/components/justep/button/button" class="btn btn-default" xid="button16" data-bind="component:{name:'$model/UI2/system/components/justep/button/button'}" data-config="{&quot;icon&quot;:&quot;icon-android-camera&quot;}"> 
          <i xid="i17" class="icon-android-camera"/>  
          <span xid="span17"/> 
        </a>  
        <a component="$model/UI2/system/components/justep/button/button" class="btn " xid="button17" data-bind="component:{name:'$model/UI2/system/components/justep/button/button'}" data-config="{&quot;label&quot;:&quot;hidden&quot;}"> 
          <i xid="i18"/>  
          <span xid="span18">hidden</span> 
        </a>  
        <a component="$model/UI2/system/components/justep/button/button" class="btn btn-default btn-icon-left" xid="button12" data-bind="component:{name:'$model/UI2/system/components/justep/button/button'}" data-config="{&quot;icon&quot;:&quot;icon-ios7-arrow-left&quot;,&quot;label&quot;:&quot;arrow-left&quot;}"> 
          <i xid="i13" class="icon-ios7-arrow-left"/>  
          <span xid="span13">arrow-left</span> 
        </a>  
        <a component="$model/UI2/system/components/justep/button/button" class="btn btn-default btn-icon-right" xid="button13" data-bind="component:{name:'$model/UI2/system/components/justep/button/button'}" data-config="{&quot;icon&quot;:&quot;icon-ios7-arrow-right&quot;,&quot;label&quot;:&quot;arrow-right&quot;}"> 
          <i xid="i14" class="icon-ios7-arrow-right"/>  
          <span xid="span14">arrow-right</span> 
        </a>  
        <a component="$model/UI2/system/components/justep/button/button" class="btn btn-default btn-icon-top" xid="button14" data-bind="component:{name:'$model/UI2/system/components/justep/button/button'}" data-config="{&quot;icon&quot;:&quot;icon-ios7-arrow-up&quot;,&quot;label&quot;:&quot;arrow-up&quot;}"> 
          <i xid="i15" class="icon-ios7-arrow-up"/>  
          <span xid="span15">arrow-up</span> 
        </a>  
        <a component="$model/UI2/system/components/justep/button/button" class="btn btn-default btn-icon-bottom" xid="button15" data-bind="component:{name:'$model/UI2/system/components/justep/button/button'}" data-config="{&quot;icon&quot;:&quot;icon-ios7-arrow-down&quot;,&quot;label&quot;:&quot;arrow-down&quot;}"> 
          <i xid="i16" class="icon-ios7-arrow-down"/>  
          <span xid="span16">arrow-down</span> 
        </a> 
      </div>  
      <h3 style="height:48px;vertical-align: middle;padding: 8px;display: inline-block;">button color</h3>  
      <a component="$model/UI2/system/components/justep/button/button" class="btn btn-link" xid="button8" data-bind="component:{name:'$model/UI2/system/components/justep/button/button'},visible:isVisible" data-events="onClick:showStyleSource" data-config="{&quot;label&quot;:&quot;源码&quot;}"> 
        <i xid="i8"/>  
        <span xid="span29">源码</span> 
      </a>  
      <div xid="buttonColor"> 
        <a component="$model/UI2/system/components/justep/button/button" class="btn btn-default" xid="button22" data-bind="component:{name:'$model/UI2/system/components/justep/button/button'}" data-events="onClick:basicEvent" data-config="{&quot;label&quot;:&quot;default&quot;}"> 
          <i xid="i23"/>  
          <span xid="span23">default</span> 
        </a>  
        <a component="$model/UI2/system/components/justep/button/button" xid="button24" class="btn btn-primary" data-bind="component:{name:'$model/UI2/system/components/justep/button/button'}" data-config="{&quot;label&quot;:&quot;primary&quot;}"> 
          <i xid="i25"/>  
          <span xid="span25">primary</span> 
        </a>  
        <a component="$model/UI2/system/components/justep/button/button" xid="button35" class="btn btn-success" data-bind="component:{name:'$model/UI2/system/components/justep/button/button'}" data-config="{&quot;label&quot;:&quot;success&quot;}"> 
          <i xid="i36"/>  
          <span xid="span36">success</span> 
        </a>  
        <a component="$model/UI2/system/components/justep/button/button" class="btn x-black" xid="button4" data-bind="component:{name:'$model/UI2/system/components/justep/button/button'}" data-config="{&quot;disabled&quot;:true,&quot;label&quot;:&quot;disabled&quot;}"> 
          <i xid="i4"/>  
          <span xid="span4">disabled</span> 
        </a>  
        <a component="$model/UI2/system/components/justep/button/button" xid="button19" class="btn btn-info" data-bind="component:{name:'$model/UI2/system/components/justep/button/button'}" data-config="{&quot;label&quot;:&quot;info&quot;}"> 
          <i xid="i20"/>  
          <span xid="span20">info</span> 
        </a>  
        <a component="$model/UI2/system/components/justep/button/button" class="btn btn-warning" xid="button7" data-bind="component:{name:'$model/UI2/system/components/justep/button/button'}" data-config="{&quot;label&quot;:&quot;warning&quot;}"> 
          <i xid="i7"/>  
          <span xid="span7">warning</span> 
        </a>  
        <a component="$model/UI2/system/components/justep/button/button" class="btn btn-danger" xid="button9" data-bind="component:{name:'$model/UI2/system/components/justep/button/button'}" data-config="{&quot;label&quot;:&quot;danger&quot;}"> 
          <i xid="i9"/>  
          <span xid="span9">danger</span> 
        </a>  
        <a component="$model/UI2/system/components/justep/button/button" class="btn btn-link" xid="button10" data-bind="component:{name:'$model/UI2/system/components/justep/button/button'}" data-config="{&quot;label&quot;:&quot;link&quot;}"> 
          <i xid="i10"/>  
          <span xid="span10">link</span> 
        </a>  
        <a component="$model/UI2/system/components/justep/button/button" class="btn x-yellow " xid="button18" data-bind="component:{name:'$model/UI2/system/components/justep/button/button'}" data-config="{&quot;label&quot;:&quot;yellow&quot;}"> 
          <i xid="i19"/>  
          <span xid="span19">yellow</span> 
        </a>  
        <a component="$model/UI2/system/components/justep/button/button" class="btn x-black" xid="button21" data-bind="component:{name:'$model/UI2/system/components/justep/button/button'}" data-config="{&quot;label&quot;:&quot;black&quot;}"> 
          <i xid="i21"/>  
          <span xid="span21">black</span> 
        </a>  
        <a component="$model/UI2/system/components/justep/button/button" class="btn x-orange" xid="button34" data-bind="component:{name:'$model/UI2/system/components/justep/button/button'}" data-config="{&quot;label&quot;:&quot;orange&quot;}"> 
          <i xid="i34"/>  
          <span xid="span34">orange</span> 
        </a>  
        <a component="$model/UI2/system/components/justep/button/button" class="btn x-green" xid="button39" data-bind="component:{name:'$model/UI2/system/components/justep/button/button'}" data-config="{&quot;label&quot;:&quot;green&quot;}"> 
          <i xid="i35"/>  
          <span xid="span35">green</span> 
        </a>  
        <a component="$model/UI2/system/components/justep/button/button" class="btn x-purple" xid="button44" data-bind="component:{name:'$model/UI2/system/components/justep/button/button'}" data-config="{&quot;label&quot;:&quot;purple&quot;}"> 
          <i xid="i40"/>  
          <span xid="span40">purple</span> 
        </a> 
      </div>  
      <h3 style="height:48px;vertical-align: middle;padding: 8px;display: inline-block;">button size</h3>  
      <a component="$model/UI2/system/components/justep/button/button" class="btn btn-link" xid="button27" data-bind="component:{name:'$model/UI2/system/components/justep/button/button'},visible:isVisible" data-events="onClick:showSizeSource" data-config="{&quot;label&quot;:&quot;源码&quot;}"> 
        <i xid="i47"/>  
        <span xid="span46">源码</span> 
      </a>  
      <div xid="buttonSize"> 
        <a component="$model/UI2/system/components/justep/button/button" class="btn btn-default btn-xs" xid="button37" data-bind="component:{name:'$model/UI2/system/components/justep/button/button'}" data-config="{&quot;label&quot;:&quot;btn-xs&quot;}"> 
          <i xid="i38"/>  
          <span xid="span38">btn-xs</span> 
        </a>  
        <a component="$model/UI2/system/components/justep/button/button" xid="button38" class="btn btn-default btn-sm" data-bind="component:{name:'$model/UI2/system/components/justep/button/button'}" data-config="{&quot;label&quot;:&quot;btn-sm&quot;}"> 
          <i xid="i39"/>  
          <span xid="span39">btn-sm</span> 
        </a>  
        <a component="$model/UI2/system/components/justep/button/button" class="btn btn-default" xid="button36" data-bind="component:{name:'$model/UI2/system/components/justep/button/button'}" data-config="{&quot;label&quot;:&quot;default&quot;}"> 
          <i xid="i37"/>  
          <span xid="span37">default</span> 
        </a>  
        <a component="$model/UI2/system/components/justep/button/button" class="btn btn-default btn-lg" xid="button40" data-bind="component:{name:'$model/UI2/system/components/justep/button/button'}" data-config="{&quot;label&quot;:&quot;btn-lg&quot;}"> 
          <i xid="i41"/>  
          <span xid="span41">btn-lg</span> 
        </a> 
      </div>  
      <h3 style="height:48px;vertical-align: middle;padding: 8px;display: inline-block;">button event</h3>  
      <a component="$model/UI2/system/components/justep/button/button" class="btn btn-link" xid="button49" data-bind="component:{name:'$model/UI2/system/components/justep/button/button'}" data-events="onClick:showJsSource" data-config="{&quot;label&quot;:&quot;js&quot;}"> 
        <i xid="i49"/>  
        <span xid="span48">js</span> 
      </a>  
      <a component="$model/UI2/system/components/justep/button/button" class="btn btn-link" xid="button48" data-bind="component:{name:'$model/UI2/system/components/justep/button/button'},visible:isVisible" data-events="onClick:showEventSource" data-config="{&quot;label&quot;:&quot;源码&quot;}"> 
        <i xid="i48"/>  
        <span xid="span47">源码</span> 
      </a>  
      <div xid="buttonEvent"> 
        <a component="$model/UI2/system/components/justep/button/button" class="btn btn-default" xid="defaultButton" data-bind="component:{name:'$model/UI2/system/components/justep/button/button'}" data-events="onClick:buttonChange" data-config="{&quot;label&quot;:&quot;看我变化&quot;}"> 
          <i xid="i27"/>  
          <span xid="span27">看我变化</span> 
        </a>  
        <a component="$model/UI2/system/components/justep/button/button" class="btn btn-default btn-icon-right" xid="button29" data-bind="component:{name:'$model/UI2/system/components/justep/button/button'}" data-events="onClick:dynamicAddButton" data-config="{&quot;icon&quot;:&quot;icon-android-send&quot;,&quot;label&quot;:&quot;添加按钮&quot;}"> 
          <i xid="i30" class="icon-android-send"/>  
          <span xid="span30">添加按钮</span> 
        </a>  
        <div xid="parent"/> 
      </div>  
      <h3 style="height:48px;vertical-align: middle;padding: 8px;display: inline-block;">buttonGroup</h3>  
      <a component="$model/UI2/system/components/justep/button/button" class="btn btn-link" xid="button46" data-bind="component:{name:'$model/UI2/system/components/justep/button/button'},visible:isVisible" data-events="onClick:showButtonGroupSource" data-config="{&quot;label&quot;:&quot;源码&quot;}"> 
        <i xid="i46"/>  
        <span xid="span45">源码</span> 
      </a>  
      <div xid="showButtonGroup"> 
        <p>buttonGroup的css：</p>  
        <div component="$model/UI2/system/components/justep/button/buttonGroup" class="btn-group" xid="buttonGroupVerShow" data-bind="component:{name:'$model/UI2/system/components/justep/button/buttonGroup'}" data-config="{&quot;tabbed&quot;:true}"> 
          <a component="$model/UI2/system/components/justep/button/button" class="btn btn-default" xid="button30" data-bind="component:{name:'$model/UI2/system/components/justep/button/button'}" data-events="onClick:setVertical" data-config="{&quot;label&quot;:&quot;setVertical&quot;}"> 
            <i xid="i31"/>  
            <span xid="span31">setVertical</span> 
          </a>  
          <a component="$model/UI2/system/components/justep/button/button" class="btn btn-default" xid="button31" data-bind="component:{name:'$model/UI2/system/components/justep/button/button'}" data-events="onClick:setJustified" data-config="{&quot;label&quot;:&quot;setJustified&quot;}"> 
            <i xid="i32"/>  
            <span xid="span32">setJustified</span> 
          </a> 
        </div>  
        <div component="$model/UI2/system/components/justep/button/buttonGroup" class="btn-group" xid="buttonGroupSizeShow" data-bind="component:{name:'$model/UI2/system/components/justep/button/buttonGroup'}"> 
          <a component="$model/UI2/system/components/justep/button/button" class="btn btn-default" title="buttonGroup btn-group-lg" xid="button23" data-bind="component:{name:'$model/UI2/system/components/justep/button/button'}" data-events="onClick:setlg" data-config="{&quot;label&quot;:&quot;setlg&quot;}"> 
            <i xid="i22"/>  
            <span xid="span22">setlg</span> 
          </a>  
          <a component="$model/UI2/system/components/justep/button/button" class="btn btn-default" xid="button25" title="buttonGroup btn-group-sm" data-bind="component:{name:'$model/UI2/system/components/justep/button/button'}" data-events="onClick:setsm" data-config="{&quot;label&quot;:&quot;setsm&quot;}"> 
            <i xid="i24"/>  
            <span xid="span24">setsm</span> 
          </a>  
          <a component="$model/UI2/system/components/justep/button/button" class="btn btn-default" xid="button28" data-bind="component:{name:'$model/UI2/system/components/justep/button/button'}" data-events="onClick:setxs" data-config="{&quot;label&quot;:&quot;setxs&quot;}"> 
            <i xid="i26"/>  
            <span xid="span26">setxs</span> 
          </a> 
        </div>  
        <p>buttonGroup的单选：</p>  
        <div component="$model/UI2/system/components/justep/button/buttonGroup" class="btn-group" xid="buttonGroup1" data-bind="component:{name:'$model/UI2/system/components/justep/button/buttonGroup'}" data-events="onSelect:showBtgVal" data-config="{&quot;tabbed&quot;:true}"> 
          <a component="$model/UI2/system/components/justep/button/button" class="btn btn-default" xid="button1" data-bind="component:{name:'$model/UI2/system/components/justep/button/button'}" data-config="{&quot;label&quot;:&quot;1&quot;}"> 
            <i xid="i1"/>  
            <span xid="span1"/> 
          </a>  
          <a component="$model/UI2/system/components/justep/button/button" class="btn btn-default" xid="button2" data-bind="component:{name:'$model/UI2/system/components/justep/button/button'}" data-config="{&quot;label&quot;:&quot;2&quot;}"> 
            <i xid="i2"/>  
            <span xid="span2"/> 
          </a>  
          <a component="$model/UI2/system/components/justep/button/button" class="btn btn-default" xid="button3" data-bind="component:{name:'$model/UI2/system/components/justep/button/button'}" data-config="{&quot;label&quot;:&quot;3&quot;}"> 
            <i xid="i3"/>  
            <span xid="span3"/> 
          </a> 
        </div> 
      </div> 
    </div> 
  </div>  
  <div xmlns="" id="aler"/>  
  <span xmlns="" component="$model/UI2/system/components/justep/windowDialog/windowDialog" xid="windowDialog" data-bind="component:{name:'$model/UI2/system/components/justep/windowDialog/windowDialog'}" data-config="{&quot;src&quot;:&quot;$model/UI2/system/components/justep/common/demo/dialog.w&quot;}"> 
    <div xmlns:xhtml="http://www.w3.org/1999/xhtml" class="x-dialog-overlay"></div>  
    <div xmlns:xhtml="http://www.w3.org/1999/xhtml" class="x-dialog">  
      <div class="x-dialog-title"> 
        <button class="close"> 
          <span>×</span> 
        </button>  
        <div class="x-dialog-title-text"/> 
      </div>  
      <div class="x-dialog-body"/> 
    </div> 
  </span> 
</div>
